<template>
  <div id="product-detail" class="card col-12 px-0 mt-5">
    <nav aria-label="breadcrumb" role="navigation">
      <ol class="breadcrumb pb-0">
        <li class="breadcrumb-item ms-1" aria-current="page">系统管理</li>
        <li class="breadcrumb-item" aria-current="page">
          <router-link to="/h5/products">服务产品</router-link>
        </li>
        <li class="breadcrumb-item active" aria-current="page">详情</li>
      </ol>
    </nav>
    <template v-if="detail !== null">
      <div class="card-body">
        <dl class="row">
          <dt class="col-4 text-end">名称</dt>
          <dd class="col-8">{{ detail.productName }}</dd>
          <dt class="col-4 text-end">代码</dt>
          <dd class="col-8">{{ detail.productCode }}</dd>
          <dt class="col-4 text-end">说明</dt>
          <dd class="col-8">{{ detail.productDesc }}</dd>
          <dt class="col-4 text-end">原价</dt>
          <dd class="col-8">{{ detail.price }}</dd>
          <dt class="col-4 text-end">优惠价</dt>
          <dd class="col-8">{{ detail.discount }}</dd>
          <dt class="col-4 text-end">成本</dt>
          <dd class="col-8">{{ detail.cost }}</dd>
          <dt class="col-4 text-end">状态</dt>
          <dd class="col-8">
            <span class="text-success" v-if="detail.status === 1">正常</span>
            <span class="text-danger" v-else>停用</span>
          </dd>
          <dt class="col-4 text-end">生成时间</dt>
          <dd class="col-8">{{ detail.createTime }}</dd>
          <dt class="col-4 text-end">修改时间</dt>
          <dd class="col-8">{{ detail.lastUpdate }}</dd>
        </dl>
      </div>
      <div class="card-footer row">
        <router-link
          :to="`/h5/product?id=` + detail.id"
          class="btn btn-primary mb-2"
          v-if="isAdmin"
        >
          修改
        </router-link>
        <button
          @click.stop="deleteInsurance(detail.id)"
          class="btn btn-danger"
          v-if="isAdmin"
        >
          删除
        </button>
      </div>
    </template>
  </div>
</template>

<script>
import { getServiceProduct, deleteInsurance } from "@/api/product.js";

export default {
  components: {
    // MyPagination
  },
  data() {
    return {
      id: 0,
      detail: null,
    };
  },
  computed: {
    isAdmin() {
      return this.$store.getters.isAdmin;
    },
  },
  mounted: function () {
    this.id = parseInt(this.$route.params.id);
    this.searchDetail();
  },
  methods: {
    back: function () {
      this.$router.go(-1);
    },
    showErrMsg: function (msg, msgType) {
      this.$store.dispatch("showAlertMsg", {
        errMsg: msg,
        errMsgType: msgType,
      });
    },
    searchDetail: function () {
      getServiceProduct(this.id, (v) => {
        this.detail = v;
      });
    },
    newProduct: function () {
      this.$router.push("/h5/product");
    },
    deleteInsurance: function (id) {
      if (window.confirm("确定删除") === false) {
        return;
      }

      deleteInsurance(
        id,
        (jsonResult) => {
          this.search();
        },
        null,
        () => {}
      );
    },
  },
};
</script>
